<template>
    <div>
        <div v-for="item in goodslist" :key="item.id" class="box" @click="getgoodsinfo(item.id)">
            <img :src="item.img_url">
            <p>{{item.title}}</p>
            <span class="new">￥{{item.sell_price}}  </span>
            <span class="old"> ￥{{item.market_price}}</span>
            <p class="hot">热卖中  剩:{{item.stock_quantity}}件</p>
        </div>
    </div>
</template>
<script>
import {getgoods} from '@/api'
export default {
    data() {
        return {
            goodslist:[]
        }
    },
    methods: {
        getgoodsinfo(id){
            this.$router.push({path:'/home/goodsinfo/'+id})
        }
    },
    created() {
        getgoods().then(res=>{
            console.log(res)
            this.goodslist = res.data.message
        })
    },
}
</script>
<style lang="less" scoped>
    .box{
        height: 293px;
        box-shadow: 0 0 2px #ccc;
        float: left;
        width: 50%;
        padding: 5px;
        img{
            width: 100%;
        }
        p{
            color: #000;
            font-weight: 700;
        }
        .new{
            color: red;
            font-weight: 700;
        }
        .old{
            font-size: 14px
        }
        .hot{
            color: #666;
            font-size: 15px;
        }
    }
</style>
